<template>
    <div class="edu-page-warp" >
        <div class="">
            <condition-card
                label-width="110px"
                label-position="right"
                @reset="reset"
                @search="searchList"
            >
                <el-row>
                    <el-col :span="8">
                        <el-form-item :label="$t('administrationClass.grade')">
                            <el-date-picker
                                v-model="queryForm.condition.grade"
                                :placeholder="$t('graduationDesign.pleaseChoose')"
                                class="search-item"
                                clearable
                                value-format="yyyy"
                                type="year"
                                style="width: 100%;"
                                @change="gradeChange"
                            />
                        </el-form-item>
                    </el-col>
                    <el-col :span="8" v-if="plateId==2">
                        <el-form-item :label="$t('school.school')">
                            <el-select
                                v-model="queryForm.condition.schoolId"
                                clearable
                                filterable
                                style="width:100%" 
                            >
                                <el-option
                                    v-for="item in options.school"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>                    
                    <el-col :span="8">
                        <el-form-item :label="$t('administrationClass.college')">
                            <el-select
                                v-model="queryForm.condition.college"
                                clearable
                                filterable
                                style="width:100%"
                                @change="collegeChange"
                            >
                                <el-option
                                    v-for="item in options.college"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item :label="$t('administrationClass.major')">
                            <el-select
                                v-model="queryForm.condition.major"
                                clearable
                                filterable
                                style="width:100%"
                            >
                                <el-option
                                    v-for="item in options.major"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
            </condition-card>
            <el-card shadow="never">
                <div class="edu-opertion-bar">
                    <div class="edu-page-title">{{ plateId | plateIdfilters }}</div>
                    <div class="float-left">
                        <KeywordInput
                            v-model="queryForm.condition.studentName"
                            placeholder="请输入学号或姓名搜索"
                            @enter="searchList"
                        />
                    </div>
                    <div class="float-right">
                        <el-button @click="onExport">{{ $t('message.export') }}</el-button>
                    </div>
                </div>
                <el-table
                    :order="false"
                    :selection="true"
                    :data="labourList"
                    @selection-change="handleSelectionChange"
                >
                    <el-table-column type="selection" width="50" />
                    <el-table-column
                        :label="$t('examinInquiry.studentNumber')"
                        prop="studentId"
                        fixed="left"
                        min-width="100"
                    />
                    <el-table-column
                        :label="$t('examinInquiry.fullName')"
                        prop="studentName"
                        show-overflow-tooltip
                        width="100"
                    />
                    <el-table-column :label="$t('examinInquiry.grade')" prop="grade" width="70" />
                    <el-table-column
                        :label="$t('examinInquiry.college')"
                        prop="collegeI18n"
                        show-overflow-tooltip
                        min-width="140"
                    />
                    <el-table-column
                        :render-header="labelHead"
                        label="专业"
                        prop="majorI18n"
                        show-overflow-tooltip
                        min-width="110"
                    />
                    <el-table-column
                        v-if="plateId==2"
                        :render-header="labelHead"
                        label="学堂"
                        prop="schoolName"
                        show-overflow-tooltip
                        min-width="140"
                    />
                    <el-table-column
                        v-if="plateId==7"
                        :render-header="labelHead"
                        label="必修学时"
                        prop="necessaryHour"                       
                        min-width="100"
                    />
                    <el-table-column
                        v-if="plateId==7"
                        :render-header="labelHead"
                        label="选修学时"
                        prop="electiveHour"                        
                        min-width="100"
                    />
                </el-table>
                <div class="edu-pagination">
                    <div class="float-right">
                        <el-pagination
                            :current-page="queryForm.pageNum_"
                            :page-sizes="[10, 20, 50, 100, 500, 1000]"
                            :page-size="queryForm.pageSize_"
                            :total="total_"
                            layout="total, sizes, prev, pager, next, jumper"
                            style="float: right;margin:10px 60px 0 0;"
                            @size-change="handleSizeChange"
                            @current-change="handleCurrentChange"
                        />
                    </div>
                </div>
            </el-card>
        </div>
    </div>
</template>
<script>
import api from 'common/src/api/score/bachelor/labourCourse'
import tools from 'common/src/views/underGraduationDesign/tools.js'
import { queryDic } from 'common/src/api/dictionary'
import UTILS from 'common/src/utils/utils'
import BPIs from 'common/src/api/welcomeService/schoolRelation'
const defaultCreateForm = {
    studentId: null,
    studentName: null,
    professionI18n: null,
    grade: '',
    score: '',
    calendarId: '',
    hour: null,
    listwaring: {}
}

// 院聘导师库
export default {
    name: '',
    components: {},
    filters: {
        plateIdfilters(plateId) {
            if (plateId == 2) {
                return '劳动习惯养成学时预警名单'
            } else if (plateId == 7) {
                return '实践环节学时预警名单'
            }
        }
    },
    props: ['plateId', 'titel_label'],
    data() {
        return {
            dialogTitle: '',
            multipleSelection: [],
            labourList: [],
            fileList: [], //导入文件
            showImportTip: false,
            mode: '',
            name: '',
            btnTip: false,
            rows: null,
            queryForm: {
                pageNum_: 1,
                pageSize_: 10,
                condition: {
                    grade: '', // 年级
                    college: '', // 学院
                    major: '', // 专业
                    page: true,
                    studentName: '',
                    schoolId:''
                }
            },
            calendarId: null,
            options: {
                college: [],
                major: [],
                school:[]
            },
            queryParams: {},
            message: '',
            createForm: UTILS.clone(defaultCreateForm),
            necessaryHour: null,
            electiveHour: null,
            isInitGrade:this.plateId==2?true:false
        }
    },
    computed: {},
    mounted() {
        this.getOptions()
        this.queryForm.condition.grade = this.isInitGrade?String(new Date().getFullYear()):null
        this.gradeChange(this.queryForm.condition.grade)
    },
    activated() {},
    methods: {
        async init(){
            if (this.necessaryHour === null && this.electiveHour === null) {
                await api.LaborEducation().then(res => {
                    if (res.code === 200 && res.data) {
                        this.necessaryHour = res.data[0].necessaryHour
                        this.electiveHour = res.data[0].electiveHour
                    }
                })
            }
            this.Scorelist()
        },
        searchList() {
            this.Scorelist()
        },
        // 预警名单列表
        Scorelist() {
            if (this.plateId == 2) {
                api.WarningList(this.queryForm).then(res => {
                    if (res.code === 200) {
                        this.labourList = res.data.list
                        this.total_ = res.data.total_
                    }
                })
            } else if (this.plateId == 7) {
                api.collegeCharaclist(this.queryForm).then(res => {
                    if (res.code === 200) {
                        if (this.necessaryHour !== null && this.electiveHour !== null) {
                            res.data.list.forEach(row => {
                                if (
                                    row.necessaryHour !== null &&
                                    Number(row.necessaryHour) > Number(this.necessaryHour)
                                ) {
                                    row.necessaryHour = this.necessaryHour
                                }
                                if (
                                    row.electiveHour !== null &&
                                    Number(row.electiveHour) > Number(this.electiveHour)
                                ) {
                                    row.electiveHour = this.electiveHour
                                }
                            })
                        }
                        this.labourList = res.data.list
                        this.total_ = res.data.total_
                    }
                })
            }
        },
        // 重置筛选框
        reset() {
            this.queryForm = {
                pageNum_: 1,
                pageSize_: 10,
                condition: {
                    grade: this.isInitGrade?String(new Date().getFullYear()):null,
                    college: '', // 学院
                    major: '', // 专业
                    page: true,
                    studentName: '',
                    schoolId:'' 
                }
            }
            this.gradeChange(this.queryForm.condition.grade)
            this.searchList()
        },
        // 筛选条件字典查询
        getOptions() {
            let data = {
                lang: this.$store.getters.language || 'cn',
                type: 'allChild',
                keys: ['X_YX']
            }
            queryDic(data).then(res => {
                UTILS.fillSelect({ college: 'X_YX' }, res.data, this.options)
            })
        },
        // 修改学院
        collegeChange(val) {
            this.options.major = []
            this.queryForm.condition.major = ''
            let data = {
                lang: this.$store.getters.language || 'cn',
                type: 'allChild',
                keys: ['G_ZY'],
                filter: {
                    grade: this.queryForm.condition.grade,
                    prefix: [val],
                    specilaCode: 'XY2ZY',
                    facultys: [val]
                }
            }
            queryDic(data).then(res => {
                UTILS.fillSelect(
                    {
                        major: 'G_ZY'
                    },
                    res.data,
                    this.options
                )
            })
        },
        gradeChange(val) {
            this.options.major = []
            this.options.school = []
            this.queryForm.condition.major = ''
            this.queryForm.condition.schoolId = ''
            if (val && this.queryForm.condition.college) {
                this.collegeChange(this.queryForm.condition.college)
            }
            if(val){
                BPIs.findSchool({pageNum_:0,pageSize_:0,condition:{grade:val}}).then(res => {
                    if (res.code == 200 && res.data.list.length > 0) {
                        for (const item of res.data.list) {
                            this.options.school.push({
                                label: item.name,
                                value: item.id
                            })
                        }
                    }
                })
            }
        },
        close(data) {
            this.btnTip = false
            if (data.id) {
                //编辑
                this.closeDialog()
            } else {
                this.$refs.createForm.clearValidate()
                this.$refs.updateDialog.close()
                this.createForm.calendarId = this.calendarCopy
            }
        },
        closeDialog() {
            this.$refs.createForm.clearValidate()
            this.$refs.updateDialog.close()
        },
        resetAddForm() {
            this.btnTip = false
            this.$refs.createForm.clearValidate()
        },
        // 勾选
        handleSelectionChange(val) {
            this.multipleSelection = val
        },
        // 分页
        handleCurrentChange(val) {
            this.queryForm.pageNum_ = val
            this.searchList(this.queryForm)
        },
        // 分页
        handleSizeChange(val) {
            this.queryForm.pageSize_ = val
            this.queryForm.pageNum_ = 1
            this.searchList(this.queryForm)
        },
        // 导出
        onExport() {
            let data = _.cloneDeep(this.queryForm.condition)
            data.studentIds = this.multipleSelection.map(item => item.studentId)
            if (this.plateId == 2) {
                api.exportrlifeSkillHour(data).then(res => {
                    if (res.code == 200) {
                        tools.downloadFile(res.data.key, '劳动习惯养成学时预警名单.xls', null, this)
                    }
                })
            } else if (this.plateId == 7) {
                api.exportcollegeCharact(data).then(res => {
                    if (res.code == 200) {
                        tools.downloadFile(res.data.key, '学院特色实践预警名单.xls', null, this)
                    }
                })
            }
        }
    }
}
</script>
